<!-- eslint-disable vuejs-accessibility/click-events-have-key-events -->
<template>
    <div class="w">
      <div class="img">
  <img src="https://bpic.588ku.com/element_origin_min_pic/19/06/15/d9b1152a4f8e7a15cf23b63a22521525.jpg" alt="">
  </div>
  <div class="text">
  <span>{{ name[0].username }}</span>
  <el-button type="danger" @click="del">退出</el-button>
  </div>
  </div>
  </template>

<script setup>

const name = JSON.parse(localStorage.getItem('user'));
const del = () => {
  // eslint-disable-next-line no-restricted-globals
  localStorage.removeItem('token');
  localStorage.removeItem('user');
  // eslint-disable-next-line no-restricted-globals
  location.reload();
};
</script>

  <style scoped lang="scss">
  .w{
    height: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-right: 50px;
  }
  .img{
    margin-left: 50px;
    width: 70px;
    height: 70px;
    img{
      width: 100%;
      height: 100%;
    }
  }
  .text{
    span{
    margin: 0 20px;
    }
  }
  </style>
